const information = document.getElementById('info')
information.innerText = `本应用正在使用 Chrome (v${versions.chrome()}), Node.js (v${versions.node()}), 和 Electron (v${versions.electron()})，和（${versions.test()}）`


const func = async () => {
  const response = await window.versions.ping()
  alert(response) // 打印 'pong'
}
document.querySelector('#myButton').addEventListener('click', () => {
  alert('666666');
  func();
});


document.querySelector('#myButton2').addEventListener('click', () => {
  const titleElement = document.querySelector('#title');
  window.electronAPI.setTitle(titleElement.value);
});


document.querySelector('#myButton3').addEventListener('click', async () => {
  const filePath = await window.electronAPI.openFile();
  alert(filePath);
});


document.querySelector('#myButton4').addEventListener('click', () => {
  // alert(123123);
  // alert(123123, window.electronAPI.showNotification)
  // window.electronAPI.showNotification();
  const NOTIFICATION_TITLE = 'Title'
  const NOTIFICATION_BODY = 'Notification from the Renderer process. Click to log to console.'
  const CLICK_MESSAGE = 'Notification clicked!'

  new window.Notification(NOTIFICATION_TITLE, { body: NOTIFICATION_BODY })
    .onclick = () => { 
      alert(CLICK_MESSAGE);
      // document.getElementById('output').innerText = CLICK_MESSAGE 
    }
});


const counter = document.getElementById('counter')
window?.electronAPI.onUpdateCounter((value) => {
  const oldValue = Number(counter.innerText)
  const newValue = oldValue + value
  counter.innerText = newValue.toString()
  window.electronAPI.counterValue(newValue) // 同步 
});


document.getElementById('toggle-dark-mode').addEventListener('click', async () => {
  const isDarkMode = await window.darkMode.toggle()
  alert(isDarkMode);
  document.getElementById('theme-source').innerHTML = isDarkMode ? 'Dark' : 'Light'
})

document.getElementById('reset-to-system').addEventListener('click', async () => {
  await window.darkMode.system()
  document.getElementById('theme-source').innerHTML = 'System'
})

// document.getElementById('drag').ondragstart = (event) => {
//   event.preventDefault()
//   window.electron.startDrag('drag-and-drop.md')
// }



window.onload = function () {
  const db = new IndexedDB(); // ./http/index.js

  window.httpApi.loginBeforeApi((value) => {
    const data = JSON.parse(value || '{}');
    document.querySelector('#beforeData').innerText = value;
    db.updateUser(data.data); // 从数接口获取数据，并存入indexedDB
  });


  // 增加数据
  document.querySelector('#addUser').addEventListener('click', function () {
    db.addUser();
  });

  // 修改数据
  document.querySelector('#updateUser').addEventListener('click', function () {
    const value = document.querySelector('#title').value;
    db.updateUser(value);
  });

  // 查询数据
  document.querySelector('#getUser').addEventListener('click', async function () {
    const data = await db.getUser('1');
    if (data !== undefined) {
      console.log('===========>获取数据', data);
      return;
    }
    console.log('===========>数据不存在');
  });

  // 删除数据
  document.querySelector('#deleteUser').addEventListener('click', function () {
    db.deleteUser('1');
  });

  // 恢复数据
  document.querySelector('#restore').addEventListener('click', function () {
    db.restoreUserTable();
  });

  
};

